//customer -> 公共样式  tips：每个公共样式写明实现的是什么功能以方便查阅
//更改时间选择插件的’至‘范围
@import "./variable.styl"

.el-date-editor .el-range-separator
  width: 10%
.el-date-editor .el-range__close-icon
  display:none

//  鼠标移入时变手
.hand
  cursor: pointer

//input的交互效果
input.input-height-item:hover,.input-height-item:hover
  border :1px solid #999 !important
.input-height
  border:2px solid rgba(102,102,102,.2) !important
  border-radius :5px
  input.input-height-item,.input-height-item
    border :1px solid #999 !important

//订单查询的时间插件样式
.order-block
  .el-date-editor--daterange.el-input, .el-date-editor--daterange.el-input__inner, .el-date-editor--timerange.el-input, .el-date-editor--timerange.el-input__inner
    width :17vw
    margin-left: 10px
    height :30px
    padding :3px 16px 3px 10px
  .el-date-editor .el-range__icon
    transform :translateY(-20%)
  .el-date-editor .el-range-input
    transform :translateY(-20%)
    width :38%
  .el-date-editor .el-range-separator
    transform :translateY(-20%)
    width: 11%
  .el-date-editor .el-range__close-icon
    position: absolute
    top: 0
    right: -2px
    display :block
.open
  .el-date-editor
    width :17vw
    .el-input__suffix
      right: 18%
  .el-date-editor .el-range-input
    font-size :13px
.end-time
  .order-block
    width: 65%
    height: 75%
    .el-date-editor.el-input, .el-date-editor.el-input__inner
      height :90%
      width :100%
    .el-input__inner
      width :100%
      height :100%
      padding :0
      padding-left: 8px
      border:none
    .el-input__icon
      display:none
    .el-input__prefix
      display :none
  &:hover
    .el-input__inner
      background :#F5F7FB
.end-time
  .order-boder
    .el-input__inner
      border :0.5px solid #ccc
      &:hover
        border :1px solid #999 !important
    &:hover
      .el-input__inner
        background :#ffffff

